@import "../base/base"; // 引入变量
$gray-index:#E5E9ED;  /* 首页背景色 */
$w100: 100%;
.hello {
  background: $gray-index;
  @include abs;
  width: $w100;
  height: 100%;
  top: 0;
  .wrapper {
    height: 100%;
    .content-index {
      height: 100%;
      .map { /* 左侧地图  */
        height: 100%;
        @include pdA(10px);
        @include rel;
        .icon-logo { /* icon标识  start */
          width: 118px;
          height: 70px;
          @include pdT(4px);
          background: rgba(0, 0, 0, .5);
          color: rgba(248, 249, 250, 1);
          font-size: $sz12;
          @include abs;
          bottom: 25px;
          left: 20px;
          ul {
            li {
              i {
                width: 10px;
                height: 10px;
                @include inline;
                border-radius: 100%;
                @include overflow;
                @include mgR(3px);
                @include mgL(10px);
              }
              &:nth-of-type(1) {
                i {
                  background: #67c23a;
                }
              }
              &:nth-of-type(2) {
                i {
                  background: #e6a23b;
                }
              }
              &:nth-of-type(3) {
                i {
                  background: #f56c6c;
                }
              }
              @include mgB(4px);
            }
          }
        }
        /* icon标识  start */
        .search { /* search start */
          width: 291px;
          height: 35px;
          border-radius: 2px;
          border: solid 1px #4E9EEF;
          background: $cr-f;
          @include abs;
          left: 20px;
          top: 25px;
          z-index: 5;
          @include pdT(4px);
          @include pdL(10px);
          .search-box-new {
            @include rel;
            .box-style {
              width: 232px;
              border: none;
              @include pdA(0);
              -webkit-appearance:none;
            }
            .btn-search {
              width: 46px;
              height: 34px;
              background: #4E9EEF url(../../../static/img/index/search.png) no-repeat center;
              background-size: 20px 22px;
              @include abs;
              right: 0;
              top: -4px;
              border: none;
            }
          }
          .serResult { /* list start */
            @include rel;
            left: -11px;
            top: 11px;
            width: 243px;
            border: none;
            background: $cr-f;
            ul {
              li {
                padding: 9px 0 8px 10px;
                display: block;
                .title {
                  font-size: $ft-sz;
                  color: #212D3D;
                  font-weight: 400;
                }
                p {
                  color: #424A55;
                  font-size: $sz12;
                  font-weight: 500;
                  @include line-height(18);
                  @include mgB(3px);
                  .lfName {
                    @include mgR(20px);
                  }
                }
                &:hover {
                  background: #EAEFF5;
                  @include cursor;
                }
              }
            }
          }
          /* list end */
        }
        /* search end */
      }
      .shape { /* 右侧图形  */
        width: 300px;
        @include mgR(10px);
        @include pdTB(5px);
        overflow-y: auto;
        .shape-item {
          @include pdTB(5px);
          .item-box {
            width: $w100;
            background: $cr-f;
            @include border-radius(10px);
            h3 {
              height: 35px;
              line-height: 35px;
              font-size: $ft-sz;
              color: #16202C;
              border-bottom: solid 1px #CCD1D9;
              @include pdL(11px);
            }
            .shape-area.shape-week {
              padding: 8px 6px 10px 6px;
              .week {
                ul {
                  li {
                    font-size: $sz12;
                    width: $w100;
                    height: 32px;
                    line-height: 32px;
                    @include pdLR(8px);
                    background: rgba(241, 245, 249, 1);
                    @include mgB(5px);
                    @include rel;
                    .sp-week-tit {
                      @include fl;
                      i.point {
                        width: 5px;
                        height: 5px;
                        @include inline;
                        font-style: normal;
                        background: rgba(74, 144, 226, 1);
                        @include border-radius(100%);
                        @include mgR(5px);
                        @include vc;
                      }
                    }
                    .sp-week-total {
                      @include fr;
                      @include pdR(10px);
                      .num {
                        font-style: normal;
                        color: #3267A5;
                        @include mgR(8px);
                      }
                      &:after {
                        content: '';
                        @include abs;
                        top: 12px;
                        right: 10px;
                        width: 7px;
                        height: 7px;
                        border-top: 1px solid rgba(144, 144, 144, 1);
                        border-right: 1px solid rgba(144, 144, 144, 1);
                        transform: rotate(45deg);
                      }
                    }
                    &:nth-of-type(2) {
                      i.point {
                        background: rgba(184, 233, 134, 1);
                      }
                    }
                    &:nth-of-type(3) {
                      i.point {
                        background: rgba(245, 166, 35, 1);
                      }
                    }
                    &:nth-of-type(4) {
                      i.point {
                        background: rgba(208, 2, 27, 1);
                      }
                      @include mgB(0)
                    }
                  }
                }
              }
            }
            .shape-area.loc-chart { /* 饼状 */
              @include pdA(10px);
              font-size: $ft-sz;
              height: 180px;
              span {
                color: #F94B3A;
                padding: 0 5px;
              }
              .pie-wrapper { /* 饼状文字 start*/
                @include rel;
                .font {
                  @include abs;
                  left: 62px;
                  bottom: 46px;
                  @include tc;
                  font-size: 10px;
                  span {
                    font-size: $ft-sz;
                  }
                }
              }
              /* 饼状文字 end*/
            }
            .shape-area.area-progress {
              padding: 0 10px 10px;
              h4 {
                line-height: 35px;
                font-weight: 500;
                color: rgba(22, 32, 44, 1);
                font-size: $ft-sz;
                span {
                  color: #F94B3A;
                  padding: 0 5px;
                }
              }
              .progress {
                ul {
                  li {
                    width: $w100;
                    padding: 0;
                    @include mgB(6px);
                    span {
                      width: 24%;
                      font-size: $sz12;
                      color: rgba(99, 109, 121, 1);
                      @include inline;
                      white-space: nowrap;
                      overflow: hidden;
                      text-overflow: ellipsis;
                    }
                    div {
                      width: 74%;
                      @include inline;
                    }
                    &:nth-last-of-type(1) {
                      @include mgB(0);
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}


/* 高德地图logo隐藏 */
.amap-logo, .amap-copyright {
    @include none;
}

  .amap-info-content {
    padding: 10px 18px;
    .wrapZb {
      li.coordinate {
        list-style-type:decimal;
        border-bottom:dashed 1px #ccc;
        padding: 5px 0;
          &:nth-last-child(1) {
            border-bottom: none;
            padding-bottom: 0;
          }
      }
    }
  }
